<template>
  <div id="profile">
    <!--头部-->
    <div class="profile-head">
      <div class="profile-info">
        <img :src="personalInfo.headPortrait" alt="用户头像">
        <div>
          <h3>{{personalInfo.employeeName}}<br/><span v-if="personalInfo.depName">{{personalInfo.depName}}</span></h3>
          <p>手机：{{personalInfo.phone}}</p>
          <p>邮箱：{{personalInfo.email}}</p>
          <p>驾照到期日期：{{personalInfo.expireDate | formatDate}}</p>
        </div>
      </div>
      <router-link
        :to="{path:'editeInfo', query:{empNo: personalId, phone:personalInfo.phone, email:personalInfo.email,expireDate:personalInfo.expireDate}}"
        class="btn-edit">编辑
      </router-link>
    </div>
    <!--信息列表-->
    <div class="profile-list">
      <div class="weui-cells">
        <div class="weui-cell">
          <div class="weui-cell__bd">
            <p>DDT到期日期</p>
          </div>
          <div class="weui-cell__ft">{{personalInfo.effectiveDate | formatDate}}</div>
        </div>
        <div class="weui-cell">
          <div class="weui-cell__bd">
            <p>发车日期</p>
          </div>
          <div class="weui-cell__ft">{{personalInfo.firstTakeCarDate | formatDate}}</div>
        </div>
      </div>
    </div>
    <!--操作列表-->
    <div class="weui-grids">
      <router-link :to="{path:'mycar', query:{empNo: personalId}}" class="weui-grid">
        <div class="weui-grid__icon">
          <img src="../../assets/images/icon_car.png" alt="我的车辆">
        </div>
        <p class="weui-grid__label">我的车辆</p>
      </router-link>
      <router-link :to="{path:'trainingrecords', query:{empNo: personalId}}" class="weui-grid">
        <div class="weui-grid__icon">
          <img src="../../assets/images/icon_train.png" alt="培训记录">
        </div>
        <p class="weui-grid__label">培训记录</p>
      </router-link>
      <router-link :to="{path:'rewardrecords', query:{empNo: personalId}}" class="weui-grid">
        <div class="weui-grid__icon">
          <img src="../../assets/images/icon_reword.png" alt="奖惩记录">
        </div>
        <p class="weui-grid__label">奖惩记录</p>
      </router-link>
      <router-link :to="{path:'patrolrecords', query:{empNo: personalId}}" class="weui-grid">
        <div class="weui-grid__icon">
          <img src="../../assets/images/icon_patrol.png" alt="巡检记录">
        </div>
        <p class="weui-grid__label">巡检记录</p>
      </router-link>
      <router-link :to="{path:'incidentrecords', query:{empNo: personalId}}" class="weui-grid">
        <div class="weui-grid__icon">
          <img src="../../assets/images/icon_incident.png" alt="事故记录">
        </div>
        <p class="weui-grid__label">事故记录</p>
      </router-link>
      <router-link :to="{path:'feedbacklist', query:{empNo: personalId}}" class="weui-grid">
        <div class="weui-grid__icon">
          <img src="../../assets/images/icon_message.png" alt="意见反馈">
        </div>
        <p class="weui-grid__label">意见反馈</p>
      </router-link>
    </div>
    <!--正在加载提示框-->
    <loading v-if="loadShow"></loading>
    <!--加载失败弹框-->
    <dialog-box :message="dialogMessage" v-if="dialogShow" @close-dialog="closeDialog"
                @cancle-dialog="closeDialog"></dialog-box>
  </div>
</template>
<script type="text/javascript">
  import '../../assets/css/profile.scss';
  import interfaceAPI from '../../assets/js/insterface.js';
  import http from '../../assets/js/http_mixin'
  import getQuery from '../../assets/js/get_querys'
  var driverInfoUrl = interfaceAPI.driverInfoUrl;
  export default{
    data(){
      return {
        personalInfo: {
          'employeeName': '未注册用户'
        }       // 用户信息
      }
    },
    mixins: [http, getQuery],
    methods: {},
    mounted()
    {
      document.title = '个人档案';
      var query = this.getQuerys();
      this.personalId = query.empNo;
      // this.personalId = 'P0055882';
      // 请求页面信息
      this.getInfo({
        url: driverInfoUrl,
        param: {
          'num': this.personalId
        },
        success: function (response) {
          if (response.body.resultCode === '1') {
            this.personalInfo = response.body.resultData;
            return false;
          }
        },
        fail: function (response) {
          this.dialogMessage = '请求失败，请稍后再试';
          this.dialogShow = true;
        }
      });
    }

  }
</script>
